ホームに戻る
関連 :
目次 :
コントロールを重ねて描く
Canvas や Grid を用いると、コントロールを重ねて表示することができる。
このとき、Panel.ZIndex の値が大きいものが手前に表示される。

Canvas を用いる場合
<
Canvas>
<!-- 矩形(赤) : 左上端と幅、高さを指定 -->
<
Rectangle Canvas.Left=
"20"
Canvas.Top=
"20"
Width=
"100"
Height=
"100"
Fill=
"Red"
Panel.ZIndex=
"0"/>
<!-- 矩形(青) : 左下端と幅、高さを指定 -->
<
Rectangle Canvas.Left=
"20"
Canvas.Bottom=
"30"
Width=
"100"
Height=
"100"
Fill=
"Blue"
Panel.ZIndex=
"2"/>
<!-- 矩形(黄) : 右下端と幅、高さを指定 -->
<
Rectangle Canvas.Right=
"100"
Canvas.Bottom=
"100"
Width=
"100"
Height=
"100"
Fill=
"Yellow"
Panel.ZIndex=
"1"/>
</
Canvas>

最も ZIndex が大きい青の矩形が最も手前に、続いて黄、赤の順で表示される。
Grid を用いる場合
<
Grid>
<
Grid.RowDefinitions>
<
RowDefinition/>
<
RowDefinition/>
</
Grid.RowDefinitions>
<
Grid.ColumnDefinitions>
<
ColumnDefinition/>
<
ColumnDefinition/>
</
Grid.ColumnDefinitions>
<!-- コントロール#1 : 奥に表示( Panel.ZIndex="0" ) -->
<
Button Grid.Row=
"0" Grid.Column=
"0" Panel.ZIndex=
"0"/>
<!-- コントロール#2 : 手前に表示( Panel.ZIndex="1" ) -->
<
Label Grid.Row=
"0" Grid.Column=
"0" Panel.ZIndex=
"1"/>
</
Grid>
Grid は複数のコントロールを同一の枠( Row および Column が共通)に配置することが可能で、その場合コントロールは重ねて描画される。